
// =========================================================
// Render page views

function renderTagLink (tagName) {
	var data = gData.tagPool[tagName];
	var el = document.createElement('div');
	var link = document.createElement('a');	

	el.appendChild(link);	
	link.href = 'javascript:selectView("tag.' + tagName + '", 0)';	

	// Now we control the text
	var text;
	if (tagName == '-')
		text = 'All';
	else
		text = tagName;

	if (data.numUnread) {
		if (data.numUnread <= 100)
			text += (' (' + data.numUnread + ')');
		else
			text += ' (100+)';
	}
	link.innerHTML = text;	

	if (gData.currResource.substring(0, 3) == 'tag' &&
	    gData.currResource.substring(4) == tagName) {
		$('link.tag.' + tagName).className = 'tagLinkSelected';
	} else {
		$('link.tag.' + tagName).className = 'tagLink';
	}
	// Attach it
	$('link.tag.' + tagName).innerHTML = el.innerHTML;
	if (data.numUnread)
		$('link.tag.' + tagName).style.fontWeight = 'bold';
	else
		$('link.tag.' + tagName).style.fontWeight = 'normal';

}

function getFromName (fromStr) {
	// Return the name in addr
	var ltPos = fromStr.indexOf('<');
	if (ltPos > 0) {
		var sect = fromStr.substring(0, ltPos).strip();
		if (sect.length > 0) {
			if (sect[0] == '"' || sect[0] == '\'')
				sect = sect.substring(1, sect.length - 1);
			return sect.substring(0, 12);			
		}		
	}	
	
	var atPos = fromStr.indexOf('@');
	if (atPos == -1)
		return fromStr;

	for (var startPos = atPos - 1; startPos >= 0; startPos--) {
		ch = fromStr.charAt(startPos);
		if (ch == ' ' || ch == '\r' || ch == '\n' ||
		    ch == '\t' || ch == '<')
			break;		
	}
	if (startPos + 1 == atPos)
		return fromStr;
	return fromStr.substring(startPos + 1, atPos);		
			
}

function renderMessageTitle (threadID) {

	// Special case in 'mail.html'
	if (document.location.pathname == '/mail.html') {
		return renderWholeThreadTitle(threadID);
	}
	
	var data = gData.currThreads[threadID];
	var widget = $('item.' + threadID + '.title');
	var link = Widget('a');			// TODO, the class	

	// TODO: href
	link.href = 'javascript:selectThread(' + threadID + ')';
	link.className = 'messageTitle';
	if (data.numUnread)
		link.style.fontWeight = 'bold';
	else
		link.style.fontWeight = 'normal';	
	var linkFrom = link.cloneNode(true);

	// Title link
	var title = data.subject.escapeHTML();
	if (data.numUnread > 1)
		title += ' (+' + data.numUnread + ')';
	link.innerHTML = title;

	// From link
	linkFrom.innerHTML = getFromName(data.from).escapeHTML();
		


	// OKOK, after all i should use table for convinice here
	var whole = '<table width="100%"><tr>';

	var jumpLink = '<a href="javascript:jumptoThreadContent('
		+ threadID + ')">';
	jumpLink += '<img border="0" src="img/go-to.gif"></a>';

	jumpLink.innerHMTL = '<img border="0" src="img/go-to.gif" />';	
	
	whole += '<td width="5%">' + returnStar(threadID) + '</td>';

	// The `` From'' Section
	var el = Widget('div');
	el.appendChild(linkFrom);		
	whole += '<td widget="15%">' + el.innerHTML + '</td>';	

	el.innerHTML = '';
	el.appendChild(link);
	whole += '<td width="74%">' + el.innerHTML + '</td>';
	
	whole += '<td width="5%" align="right">' + jumpLink + '</td>';
	
	widget.innerHTML = whole;	
}

function parseMessageContent (contentText, docID) {
	// A really simple version
	var lines = contentText.split('\r\n');
	var text = '';
	var quoted = '';
	var handle = '';
	var i;
	var quoteFrom = -1;

	for (i in lines) {
		line = lines[i];
		testLine = line.replace(/^\s+/, '');	// lstrip
		if (testLine.charAt(0) == '>' ||
		    testLine.charAt(0) == ':' ||
		    testLine.substring(0, 4) == '----' ||
		    testLine.substring(0, 4) == '____') {
			quoteFrom = i;
			break;
		}
		text += (line + '\r\n');
	}

	if (quoteFrom != -1) {
		handle = '<a href="javascript:toggleQuote(' + docID + ')">';
		handle += 'Show/Hide quoted text</a>'
		quoted = '';
		for (i = quoteFrom; i < lines.length; i++)
			quoted += (lines[i] + '\r\n');
	}

	var el = Widget('div');
	var content = Widget('pre', '', 'mailContentPre');
	content.appendChild(document.createTextNode(text))
	el.appendChild(content);

	if (quoted) {
		el.innerHTML += handle;		
		var quoteContent = Widget('div');
		quoteContent.innerHTML = '<pre>' + quoted.escapeHTML() +
			'</pre>';
		quoteContent.id = 'content.quote.' + docID;
		quoteContent.style.display = 'none';

		el.appendChild(quoteContent);
	}
	return el.innerHTML;


}

function toggleQuote(docID) {
	widget = $('content.quote.' + docID);

	s = widget.style.display;
	
	if (widget.style.display == 'none')
		widget.style.display = 'block';
	else
		widget.style.display = 'none';	
}

function parseMessageHeader (headerName, data) {
	return '<tr><td><b>' + headerName + ':</b></td><td>' +
		data.escapeHTML() + '</td></tr>';
	
}

function renderMessageTitleArea (data, docID) {
	var widget = Widget('tr');
	var leftCol = Widget('td');
	leftCol.width="80%";
	
	
	var titleArea = Widget('table');
	var text = '';
	text += parseMessageHeader('Subject', data.subject);
	text += parseMessageHeader('From', data.from);
	text += parseMessageHeader('To', data.to);
	if (data.cc) text+= parseMessageHeader('CC', data.cc);
	text += parseMessageHeader('Date', data.date);
	titleArea.innerHTML = text;

	leftCol.appendChild(titleArea);	

	// The control place
	var rightCol = Widget('td');
	
	var op1 = Widget('div');
	op1.appendChild(Link('/send.html#reply.' + docID,
			     'Reply', '_blank'));
	rightCol.appendChild(op1);
	var op2 = Widget('div');
	op2.appendChild(Link('/send.html#replyall.' + docID,
			     'Reply to All', '_blank'));
	rightCol.appendChild(op2);
	var op3 = Widget('div');
	op3.appendChild(Link('/send.html#forward.' + docID,
			     'Forward', '_blank'));
	rightCol.appendChild(op3);
	

	// Tags is special:
	createTagsArea(rightCol, docID, data.tags);
	widget.appendChild(leftCol);
	

	widget.appendChild(rightCol);

        var el1 = Widget('table');
	el1.appendChild(widget);
	el1.width="100%";
	var el2 = Widget('div', null, 'mailContentTitle');
	el2.appendChild(el1);

	return el2;
	
}

function renderMessageContent (servReturn, docID) {
	var data = servReturn[0];
	var widget = $('content.' + docID);

	widget.innerHTML = '';
	// Step 1: Title area
	var titleArea = renderMessageTitleArea(data, docID);
	widget.appendChild(titleArea);

	// Step 2: content area
	var contentArea = Widget('div', null, 'mailContentBody');
	contentArea.innerHTML = parseMessageContent (data.content, docID);
	widget.appendChild(contentArea);

	// Step 3: payload area
	var payloadArea = Widget('div', null, 'mailContentPayload');
	text = 'Attachments: ';
	for (var i in data.payload) {
		var name = data.payload[i][0];
		var type = data.payload[i][1];
		if (i > 0) text += ', ';
		
		text += '<a href="/ui/content/payload/' +
			docID + '/' + name + '" target="_blank">' +
			name.escapeHTML() + ' <i>(' + type + ')</i></a>'
	}
	payloadArea.innerHTML = text;
	widget.appendChild(payloadArea);
}

function renderWholeThreadTitle (threadID) {
	var data = gData.currThreads[threadID];	
	var widget = $('threadTitle');

	var starPart = returnStar(threadID);
	var titlePart = data.subject.escapeHTML();
 	var filterPart = Widget('div', 'filter.' + threadID);

	var text = '<table width="100%"><tr>';
	text += '<td width="3%">' + starPart + '</td>';
	text += '<td width="80%">' + titlePart + '</td>';
	text += '<td width="16%" align="right" style="padding-right : 8px">' +
		getHTML(filterPart) + '</td>';
		
	widget.innerHTML = text;
	drawThreadFilter(threadID, '');

	// Also set the document title
	document.title = data.subject;
	
}


